<template>
	<view class="content">
		<!-- 840 × 480 -->
		<view class="text-area">
			<text class="title"></text>
		</view>
		<!-- <web-view :src="url"></web-view> -->
		<view class="btn-row" style="margin-top: 200rpx;">
			<button style="width: 400rpx;" type="primary" class="primary" @tap="enterH5FaceVerify">进 入 刷 脸</button>
		</view>

	</view>
</template>

<script>
	import {
		randomString
	} from '@/common/utils.js';
	const ocr = uni.requireNativePlugin('DC-WBH5FaceVerifyService');
	export default {
		data(){
			return{
				url:'',
				id:''
			}
		},
		onLoad(e) {
			let data = uni.getStorageSync('urls')
			this.url = data
			this.id = e.id
			console.log(this.url,e.id,'akdjfdsl')
		},
		onShow() {
			let self = this
			if(self.bool){
				self._post('/aiqian.Aiqian/faceResult',{order_id:self.id},function(res){
					if(res.code==1){
						uni.redirectTo({
							url: "/pages/order/order-detail?order_id=" + self.id
						})
					}
				})
			}
		},
		methods: {
			enterH5FaceVerify() {
				let url = this.url; //拉起h5刷脸的
				let thirdurl = "https://zuwu.rchz.top/h5/#/"; //h5刷脸完成后要跳转的接入方的url，这个接入方填写自己的url可
				ocr.startH5FaceVerify({
					h5faceurl: url,
					h5thirdurl: thirdurl
				}, result => {
					console.log(result, "H5刷脸后跳转到thirdurl所在h5页面的回调");
					ocr.destroyH5Activity(null); //调用关闭插件的webView.
					//uniapp todo 接入方自己的逻辑

				}, result => {
					//这里是终端接受h5页面的消息回调。uniapp与h5页面两者通信可通过这个回调作为中间桥接实现。
					//注意：约定h5页面和webView通信通过JavaScriptInterface接口和JavaScript进行交互。在H5页面中使用window.tencentApi.postMessage的方式来调用这个方法，参数为String类型。如果是jsonobject需要转String
					console.log(result, "自定义回调");
					//uniapp todo 接入方自己的逻辑
				});
				this.bool = true
				console.log("click=======意愿性刷脸====>startH5FaceVerify");
			}
		}
	}
</script>

<style>
	
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}

	.img {
		width: 280px;
		height: 160px;
		margin-top: 50px;

	}

	.button {
		margin-top: 20px;
		display: flex;
		justify-content: center;
	}

	.result-area {
		word-break: break-all;
		padding: 20px;
		line-height: 20px;
	}

	.result-area-item {
		margin-top: 10px;
	}
</style>